/* 简单的 UI, 提供简单的布局
参考 Ant Design 的设计模式　ant.design/docs/spec/overview-cn
*/
/* 统一处理 */
* {box-sizing: border-box;}
body {font-family: Arial;padding: 0; margin: 0;background: #e2e2e2;}
a {text-decoration: none;color: #000000;}

/* 头部 */
.simpleui-header {background-color: #ffffff; height: 44px; font-size: 15px; font-weight: 500;}
/* 导航条 */
.simpleui-topnav {width: 80%;margin: 0 auto;overflow: hidden;padding-top: 6px;}
.simpleui-topnav a {float: left;display: block;text-align: center;padding: 5px;}
.simpleui-topnav a:hover {color: #99a;}
.simpleui-topnav-logo {display: block;font-size: 20px;}
.simpleui-topnav-logo:hover {color: #000000 !important;}
/* 容器 */
.simpleui-container {width: 80%;margin: 0 auto; padding: 0 10px}
/* 容器后面清除浮动 */
.simpleui-container:after {content: "";display: table;clear: both;}
/* 盒子 */
.simpleui-box {background-color: #ffffff;margin-top: 20px;}
/* 盒内行*/
.simpleui-row {padding: 10px;}
.simpleui-row-title {border-bottom: 1px solid #e2e2e2;color: #6f6f6f;}
/* 左列 */
.simpleui-leftcolumn {float: left;width: 65%;}
/* 右列 */
.simpleui-rightcolumn {float: left;width: 35%;padding-left: 20px;}

/* 侧边栏卡片 */
.simpleui-card {background-color: #ffffff;padding: 20px;}
.simpleui-card h3 {margin-top: 0;}
/* 底部栏 */
.simpleui-footer {color: #888;padding: 10px;text-align: center;margin-top: 20px;}

/* 文章列表 */
.simpleui-article-item {background-color: #ffffff;padding: 10px 10px 0 10px;border-bottom: 1px solid #e2e2e2;}
.simpleui-article-item-title {font-size: 1.2em;font-weight: bolder;}
.simpleui-article-item-content {margin: 5px 0;}
.simpleui-article-item-attr {font-size: 0.8em;margin: 10px 0;}
.simpleui-article-item-image {width: 100%;margin: 10px 0;}

/* 大型屏幕 */
@media screen and (min-width: 1200px) {
    .simpleui-container, .simpleui-topnav {width: 1170px;}
}
/*  中等屏幕(桌面) 两列布局改为上下布局 */
@media screen and (min-width: 992px) and (max-width: 1200px){
    .simpleui-container, .simpleui-topnav {width: 970px;}
}
/* 小屏幕(平板) */
@media screen and (min-width: 768px) and (max-width: 992px){
    .simpleui-container {width: 750px;}
}
/* 超小屏幕(手机)*/
@media screen and (max-width: 768px) {
    /*.simpleui-topnav a {float: none;width: 100%;}*/
    .simpleui-container , .simpleui-topnav {width: auto;}
    .simpleui-leftcolumn, .simpleui-rightcolumn {width: 100%;padding: 0;}
}

/* 图像部分 */
.fakeimg {background-color: #aaa;width: 100%;padding: 20px;}

/* 颜色*/
.simpleui-color-black { color: #000000; }
.simpleui-color-gray-6f { color: #6f6f6f; }
.simpleui-color-gray-e2 { color: #e2e2e2; }

/* a 标签 */
.simpleui-a-hover:hover {text-decoration: underline;}
.simpleui-a-underline {text-decoration: underline;}

/* 列表 */
.simpleui-ul {padding-inline-start: 0;}
.simpleui-ul li {list-style-type:none;}

/* 表单 */
.simpleui-form {}
.simpleui-form  .simpleui-form-label{width: 100px;display: inline-block;text-align: right;margin-right: 5px;}
.simpleui-form  .simpleui-input-block{margin-left: 105px;margin-top: 2px;}